<template>
  <div class="text_dialog">
    <textDialog>
      <!-- 头部 -->
      <template #header>
        <header>
          <div style="display: flex;">
            <div class="head_top">
            <span>总分</span>
            <span>{{ data.scores }}</span>
          </div>
          <div class="head_top" v-if="props.isTest">
            <span>通过分数</span>
            <span>{{ data.pastscores }}</span>
          </div>
          <div class="head_top" v-if="!props.isTest">
            <span>添加时间</span>
            <span>{{ data.addtime }}</span>
          </div>
          <div class="head_top" v-if="props.isTest">
            <span>考试时长</span>
            <span>{{
              data.limittime == "" ? "不限时" : data.limittime + "分钟"
            }}</span>
          </div>
          <div class="head_top" v-if="props.isTest">
            <span>开放时间</span>
            <span>{{
              data.begintime === null  ? "时间不限" : data.begintime + "至" + data.addtime
            }}</span>
          </div>
          </div>
          <el-button style="font-size: 12px" @click="exportExecl">导出excel</el-button>
        </header>
      </template>

      <!-- 内容 -->
      <template #content>
        <testDetails :questions="questions"></testDetails>
      </template>
    </textDialog>
  </div>
</template>

<script lang="ts" setup>
import { reactive, toRefs, watch } from "vue";
import textDialog from './textDialog.vue'
import moment from "moment";
import {subjectsGet,exportExcel} from '../../api/subjects'
import { useDialogStore } from '../../store/dialog';
import testDetails from './testDetails.vue'
import {handleDownloadFileBlob} from '../../utils/utils'

const dialogStore = useDialogStore()
const { type, show, title } = toRefs(dialogStore)
const datas: any = reactive({
  // 学生id
  id: 0,
  questions: [],
  data: [],
});
const {  id, questions, data } = toRefs(datas);
// 弹出框
const props = defineProps({
  id: {
    type: Number,
  },
  isTest:{
    type:Boolean
  }
});
// 父传子
watch([props], () => {
  console.log(66666,props.isTest)
  id.value = props.id;
  if(props.isTest){
    
  }else{
    subjectsList()// 根据id获取单个考试信息
  }
});

// 根据id获取单个考试信息
const subjectsList = async()=>{
  const res = await subjectsGet({id:id.value})
  console.log(2312312321312,res);
  datas.data = res.data;
  datas.data.addtime = moment(datas.data.addtime).format('YYYY-MM-DD HH:mm')
  datas.questions = res.data.questions;
}

// 导出
const exportExecl = async()=>{
  const res = await exportExcel({id:id.value})
  console.log(res);
  handleDownloadFileBlob(res,title.value)
}
</script>

<style lang="less" scoped>
  header{
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #ddd;
    padding-bottom: 10px;
    .head_top{
      display: flex;
      flex-direction: column;
      padding: 0 15px;
    }
  }
</style>